import React, { useRef, useEffect, useState } from "react";

import {
  LoginForm,
  LoginFormPage,
  ProConfigProvider,
} from "@ant-design/pro-components";
import { theme, Tabs } from "antd";
// import { useNavigate } from 'react-router-dom'
const Page: React.FC = () => {
  // const navigate = useNavigate()
  const { token } = theme.useToken();
  const [loginType, setLoginType] = useState<LoginType>('account');
  return (
    <ProConfigProvider hashed={false}>
      <div style={{ backgroundColor: token.colorBgContainer }}>
        <LoginForm title="系统登录" subTitle="吴兴区最好的基础版本">
          <Tabs
            centered
            activeKey={loginType}
            onChange={(activeKey) => setLoginType(activeKey as LoginType)}
          >
            <Tabs.TabPane key={"account"} tab={"账号密码登录"} />
            <Tabs.TabPane key={"phone"} tab={"手机号登录"} />
          </Tabs>
        </LoginForm>
      </div>
    </ProConfigProvider>
  );
};

export default Page;
